<!DOCTYPE html>
<html lang="zh-CN">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>酒店</title>
		<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-touch-fullscreen" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="format-detection" content="telephone=no">
		<meta name="format-detection" content="address=no">
		<link rel="stylesheet" type="text/css" href="/hodelcss/common.css">
		<link rel="stylesheet" type="text/css" href="/hodelcss/index.css">
		<link rel="stylesheet" type="text/css" href="/hodelcss/mui.min.css"/>
		<link rel="stylesheet" href="/hodelcss/reset.css">
		<script type="text/javascript" src="/hodeljs/jquery.min.js"></script>
		<script type="text/javascript" src="/hodeljs/iscroll.js"></script>
		<script type="text/javascript" src="/hodeljs/jquery.flexslider-min.js"></script>
		<script src="/hodeljs/hmt.js" type="text/javascript"></script>
		<script type="text/javascript" src="/hodeljs/index.js"></script>
		<script src="/hodeljs/swiper.min.js" type="text/javascript" ></script>

		<!--项目自用js-->
		<script src="/js/jquery/jquery.min.js"></script>
		<script src="/js/bootstrap-4.1.1-dist/js/bootstrap.min.js"></script>
		<link rel="stylesheet" href="/css/font/css/font-awesome.min.css"/>
		<link rel="stylesheet" href="/css/reset.css"/>
		<link rel="stylesheet" href="/css/myStrategyComment.css"/>
		<script src="/js/plugins/jrender/jrender.min.js"></script>
		<link rel="stylesheet" href="/js/plugins/dialog2/dialog.css"/>
		<script src="/js/plugins/dialog2/dialog.min.js"></script>
		<script src="/js/plugins/form/jquery.form.js"></script>
		<script src="/js/common.js"></script>

		<script>
			$(function () {
                //根据用户传来的id 查询商品
				var params = getParams();
				if(params.state){
                    $("#shop").html("已购买");
				}

				if(params.id){
                    $.get("/hotel/"+params.id,function (data) {
                        $("#container").renderValues({list:data});
                    })
				}

				//给客服绑定点击事件
				$(".person").click(function () {
                    $(document).dialog({
                        type: 'notice',
                        content: '<span class="info-text">长的太丑 客服不想搭理~</span>',
                        autoClose: 2000
                    })
                });

                //获取当前用户
                var user = JSON.parse(sessionStorage.getItem('user'));

				//给购物车添加绑定事件
                $("#shops").click(function () {
                    if(user){
						//发送请求改变购物车的状态
						if(params.id){
							$.post("/hotelProducts/put",{userId:1,productsId:params.id,prodecutState:2},function (data) {

							});
							$(this).html("已加入购物车");
							$(document).dialog({
								type : 'confirm',
								closeBtnShow: true,
								content: '亲,已加入购物车 是否跳到购物车页面?',
								onClickConfirmBtn: function(){
									window.location.href="/cutOrders.html";
								}
							});
						}
                    }else {
                        $(document).dialog({
                            content: "请先登录"
                        });
					}


                });
                //给购买添加绑定事件
				$("#shop").click(function () {
					if(user){
					  $(this).html("已购买");
						window.location.href="/pay.html?id="+params.id;
					}else{
                        $(document).dialog({
                            content: "请先登录"
                        });
					}
				})

            })

		</script>


	</head>
	<body>
		<header class="hasManyCity hasManyCitytwo" id="header">
			<a href="javascript:history.go(-1)" class="fl fanhui"><i class="iconfont icon-fanhui"></i></a>
			<div id="locaitonBtn" class="link-url locaitonBtn"></div>

		</header>
		<div id="container">		
			<div id="main">		
				<div class="warp warptwo clearfloat">
					<div class="detail clearfloat">
						<!--banner star-->
						<section class="banner bannertwo">
							<div class="swiper-container swiper-container1">
								<div class="swiper-wrapper bannerwidth">
									<div class="swiper-slide swiper-slide-duplicate">
										<a href="#">
											<img render-src="list.coverUri">
										</a>
									</div>

								</div>
							</div>
						</section>
						<!--banner end-->
						<div class="top clearfloat box-s">
							<div class="shang clearfloat">

								<div class="zuo clearfloat fl over2 box-s" style="color: grey" render-html="list.hotel">
								</div>
								<div class="zuo clearfloat fl over2 box-s" style="color: goldenrod" render-html="list.bedName">
								</div>
								<div class="you clearfloat fr">
									<p>热门床铺已售</p>
								</div>
							</div>
							<div class="xia clearfloat">
								<p class="jifen fl box-s"><samp render-html="list.price">2998</samp>人民币+奖<samp render-html="list.integralPrice"></samp>积分</p>
								<span class="fr" render-html="list.orders"></span>
							</div>
						</div>
						<div class="middle clearfloat box-s"><div>酒店信息介绍</div>
							<div class="zuo clearfloat fl over2 box-s" render-html="list.comment">
								小米Max大神asasas
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		
		<!--footerone star-->
		<div class="footerone clearfloat">
			<div class="left clearfloat fl">
				<ul>
					<li>
						<a href="/hotelindex.html">
							<i class="iconfont icon-shangcheng"></i>
							<p>商城</p>
						</a>
					</li>
					<li>
						<a href="#" class="person">
							<i class="iconfont icon-kefu1"></i>
							<p>客服</p>
						</a>
					</li>
				</ul>
			</div>
			<div class="right clearfloat fl">
				<span class="btn fl" id="shops">加入购物车</span>
				<span class="btn btnone fl" id="shop">立即购买</span>
				<!--<a href="self-torder.html" class="btn btnone fl">立即购买</a>-->
			</div>
		</div>
		<!--footerone end-->
		
		<!--这里是弹出购物车内容-->
		<div class="am-share">
		<div class="am-share-footer">
			<span class="share_btn">
				<img src="img/chahao.png"/>
			</span>
		</div>
		  <div class="am-share-sns box-s">
		     <div class="sdetail clearfloat">
		     	<div class="top clearfloat">
		     		<div class="tu clearfloat fl">
		     			<span></span>
		     			<img src="img/22.jpg"/>
		     		</div>
		     		<div class="you clearfloat fl">
		     			<p class="tit">小米Max</p>
		     			<span>2998购物币+700积分</span>
		     		</div>
		     	</div>
		     	<div class="middle clearfloat">
		     		<p>颜色分类</p>
		     		<div class="xia clearfloat">
		     			<ul>
			     			<li class="ra3 cur">金色</li>
			     			<li class="ra3">灰色</li>
			     		</ul>
		     		</div>		     		
		     	</div>
		     	<div class="middle clearfloat">
		     		<p>机身内存</p>
		     		<div class="xia clearfloat">
		     			<ul>
			     			<li class="ra3 cur">128G</li>
			     			<li class="ra3">16G</li>
			     		</ul>
		     		</div>		     		
		     	</div>
		     	<div class="bottom clearfloat">
		     		<p class="fl">购买数量</p>
		     		<div class="you clearfloat fr">
		     			<ul>
		     				<li><img src="img/jian.jpg"/></li>
		     				<li>1</li>
		     				<li><img src="img/jia.jpg"/></li>
		     			</ul>
		     		</div>
		     	</div>
		     </div>		     
		  </div>
		  <a href="shopcar.html" class="shop-btn db">确定</a>
		</div>
		
		
	</body>
	<script src="js/other.js" type="text/javascript"></script>
</html>
